<template>
	<view class="p30">
		<ul class="bgw ">
			<li v-for="(v,i) in priceArray" :key="i">
				<view class="top">
					<span>消费满</span>
					<input type="number" v-model="v.exceedPrice" />
					<span>元</span>
				</view>
				<view class="top">
					<span>减</span>
					<input type="number" v-model="v.deductionPrice" />
					<span>元</span>
				</view>
				<image @tap="delect(i)" class="delect" src="../../static/image/delectDicount.png" mode=""></image>
			</li>
			<view  @tap="addArray()" class="bottom">
				<image class="vm" src="../../static/image/discountAdd.png" mode=""></image>
				添加下一个优惠级别
			</view>
		</ul>
		<view class="timeBox p30">
			<view class="time bb">
				开始时间
				<view @tap="timeShow('stare')" class="fr">
					{{startDate}}
					<image src="../../static/image/go.png" mode=""></image>
				</view>
			</view>
			<view class="time ">
				结束时间
				<view @tap="timeShow('endDate')" class="fr">
					{{endDate}}
					<image src="../../static/image/go.png" mode=""></image>
				</view>
			</view>
		</view>
		<u-picker v-model="show" mode="time" :params="params" @confirm="date"></u-picker>
		<u-button @tap="checking" class="addBtn" type="success">完成</u-button>
	</view>
</template>

<script>
	import {
		activityCreate,
		activityUpdate
	} from '../../api/api.js'
	import {
		start
	} from '@/tool/index.js'
	export default {
		data() {
			return {
				id: 0,
				isAdd: false,
				priceArray: [],
				act: '',
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: true
				},
				startDate: '请选择',
				endDate: '请选择',
				show: false
			}
		},
		onLoad(e) {
			if (e.isAdd) {
				this.isAdd = true
				let setDiscount = uni.getStorageSync('setDiscount')
				this.startDate = setDiscount.startDate
				this.endDate = setDiscount.endDate
				this.priceArray = setDiscount.activityItems
				this.id = setDiscount.id 
				console.log(setDiscount);
			} else {
				let parameret = {
					exceedPrice: '',
					deductionPrice: ''
				}
				this.priceArray.push(parameret)
			}

		},
		methods: {
			delect(i) {
				this.priceArray.splice(i, 1)
			},
			addArray() {
				let parameret = {
					exceedPrice: '',
					deductionPrice: ''
				}
				this.priceArray.push(parameret)
			},
			timeShow(type) {
				this.act = type
				this.show = true
			},
			checking() {
				for (let i = 0; i < this.priceArray.length; i++) {
					let exceedPrice = this.priceArray[i].exceedPrice
					let deductionPrice = this.priceArray[i].deductionPrice
					
					if (exceedPrice == '' || deductionPrice == '') {
						this.priceArray.splice(i, 1)
						i = -1
					}  
					this.priceArray[i].itemId = this.priceArray[i].id
				}

				try {
					if (this.priceArray == '') throw '请添加优惠'
					if (this.startDate == '请选择') throw '请选择开始时间'
					if (this.endDate == '请选择') throw '请选择结束时间'
				} catch (e) {
					if (e == '请添加优惠') {
						this.addArray()
					}
					uni.showToast({
						title: e,
						icon: 'none'
					})
					return
				}
				this.send()
			},
			async send() {
				if (this.isAdd) {
					let data = await activityUpdate({
						startDate: this.startDate,
						endDate: this.endDate,
						id: this.id,
						activityItems: this.priceArray
					})
					if (data.code == 0) {
						this.$backs()
					}
				} else {
					let data = await activityCreate({
						startDate: this.startDate,
						endDate: this.endDate,
						id: this.id,
						activityItems: this.priceArray
					})
					if (data.code == 0) {
						this.$backs()
					}
				}


			},
			date(e) {
				let date = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}:${e.second}`
				if (this.act == 'stare') {
					this.startDate = date
				} else {
					this.endDate = date
				}
			},
		}
	}
</script>

<style lang="less" scoped>
	ul {
		border-radius: 20rpx;
		margin-top: 20rpx;
		padding: 30rpx;
	}

	li {
		background: white;
		border-radius: 10rpx;
		position: relative;
		margin-bottom: 30rpx;
	}

	.top {
		display: flex;
		font-size: 32rpx;
		color: #1A1A1A;
		padding: 20rpx;
		background: #F8F8F8;

		span {
			display: inline-block;
			width: 120rpx;
			padding-top: 10rpx;
		}

		input {
			width: 300rpx;
			text-align: right;
			background: white;
			margin-right: 14rpx;
			height: 66rpx;
			line-height: 66rpx;
			line-height: 66rpx;
		}
	}

	.delect {
		position: absolute;
		right: 40rpx;
		top: 50%;
		transform: translate(0, -50%);
		width: 34rpx;
		height: 34rpx;
	}

	.bottom {
		width: 100%;
		text-align: right;
		color: #3C9CFF;
		margin-top: 40rpx;
		font-size: 28rpx;

		image {
			width: 34rpx;
			height: 34rpx;
			margin-right: 20rpx;
		}
	}

	.timeBox {
		margin-top: 40rpx;
		height: 240rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		font-size: 32rpx;
		color: #1A1A1A;
		line-height: 51px;

		>view {
			height: 120rpx;
			line-height: 120rpx;
		}

		.fr {
			font-size: 28rpx;
		}

		image {
			width: 14rpx;
			height: 26rpx;
			margin-left: 20rpx;
		}
	}

	.addBtn {
		width: 690rpx;
		height: 84rpx;
		border-radius: 50rpx;
		position: fixed;
		left: 30rpx;
		bottom: 40rpx;
	}
</style>
